// Name:            Nestable
// Description:     Defines styles for nestable lists
//
// Component:       `uk-nestable`
//
// Sub-objects:     `uk-nestable-list`
//                  `uk-nestable-item`
//                  `uk-nestable-placeholder`
//                  `uk-nestable-empty`
//                  `uk-nestable-handle`
//                  `uk-nestable-moving`
//                  `[data-nestable-action='toggle']`
//
// Modifier:        `uk-nestable-list-dragged`
//
// States:          `uk-parent`
//                  `uk-collapsed`
//
// Markup:
//
// <!-- uk-nestable addon -->
// <ul class="uk-nestable" data-uk-nestable>
//     <li>
//         <div class="uk-nestable-item">
//             <div class="uk-nestable-handle"></div>
//             <div data-nestable-action="toggle"></div>
//             <span></span>
//         </div>
//     </li>
// </ul>
//
// ========================================================================


// Variables
// ========================================================================

@nestable-padding-left: 40px;
@nestable-dragged-z-index: 1050;

@nestable-item-margin-bottom: 10px;
@nestable-item-padding: 0; // modified
@nestable-item-background: #f6f6f6; // modified

@nestable-placeholder-border: #e4e4e4; // modified

@nestable-empty-height: 40px;

@nestable-handle-font-size: 15px; // modified
@nestable-handle-color: #979898; // modified
@nestable-handle-icon: "\f0c9";

@nestable-toggle-color: @nestable-handle-color; // modified
@nestable-toggle-hover-color: darken(@nestable-handle-color, 10%); // modified
@nestable-toggle-icon: "\f068"; // modified
@nestable-toggle-collapsed-icon: "\f067"; // modified


/* ========================================================================
   Component: Nestable
 ========================================================================== */

.uk-nestable {
  padding: 0;
  list-style: none;
  .hook-nestable;
}


/* Sub-object `uk-nestable-list`
 ========================================================================== */

.uk-nestable-list {
  margin: 0;
  padding-left: @nestable-padding-left;
  list-style: none;
}


/* Sub-modifier `uk-nestable-list-dragged`
 ========================================================================== */

.uk-nestable-list-dragged {
  position: absolute;
  z-index: @nestable-dragged-z-index;
  padding-left: 0;
  pointer-events: none;
  .hook-nestable-list-dragged;
}


/* Sub-object `uk-nestable-item`
 ========================================================================== */

.uk-nestable-item {
  margin-bottom: @nestable-item-margin-bottom;
  padding: @nestable-item-padding;
  background: @nestable-item-background;
  .hook-nestable-item;
}


/* Sub-object `uk-nestable-placeholder`
 * The placeholder which marks the drop area
 ========================================================================== */

.uk-nestable-placeholder {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin-bottom: @nestable-item-margin-bottom;
  border: 1px dashed @nestable-placeholder-border;
  .hook-nestable-placeholder;
}


/* Sub-object `uk-nestable-empty`
 * The style of an empty list
 ========================================================================== */

.uk-nestable-empty {
  min-height: @nestable-empty-height;
  .hook-nestable-empty;
}


/* Sub-object `uk-nestable-handle`
 ========================================================================== */

.uk-nestable-handle {
  display: inline-block;
  font-size: @nestable-handle-font-size;
  color: @nestable-handle-color;
  .hook-nestable-handle;
}

/* Hover */
.uk-nestable-handle:hover {
  cursor: move;
}

/* Icon */
.uk-nestable-handle:after {
  content: @nestable-handle-icon;
  font-family: FontAwesome;
}


/* Sub-object `uk-nestable-moving`
 ========================================================================== */

.uk-nestable-moving,
  /* Needed if moving over links or buttons */
.uk-nestable-moving * {
  cursor: move;
}


/* Sub-object `[data-action='toggle']`
 ========================================================================== */

/* Hidden by default */
[data-nestable-action='toggle'] {
  display: inline-block;
  color: @nestable-toggle-color;
  visibility: hidden;
  .hook-nestable-toggle;
}

/* Hover */
[data-nestable-action='toggle']:hover {
  color: @nestable-toggle-hover-color;
  cursor: pointer;
}

/* Icon */
[data-nestable-action='toggle']:after {
  content: @nestable-toggle-icon;
  font-family: FontAwesome;
}

/*
 * Show if nested
 */

.uk-parent > .uk-nestable-item [data-nestable-action='toggle'] {
  visibility: visible;
}

/*
 * Collapsed
 */

.uk-collapsed > .uk-nestable-item [data-nestable-action='toggle']:after {
  content: @nestable-toggle-collapsed-icon;
}

.uk-collapsed .uk-nestable-list {
  display: none;
}


// Hooks
// ========================================================================

.hook-nestable-misc;

.hook-nestable() {
}

.hook-nestable-list-dragged() {
}

.hook-nestable-item() {
}

.hook-nestable-placeholder() {
}

.hook-nestable-empty() {
}

.hook-nestable-handle() {
}

.hook-nestable-toggle() {
}

.hook-nestable-misc() {
}